<%-- 
    Document   : student
    Created on : 2019-7-17, 9:26:56
    Author     : dusin
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="description" content="particles.js is a lightweight JavaScript library for creating particles.">
        <meta name="author" content="Vincent Garreau" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <link rel="stylesheet" media="screen" href="css/style.css">
        <link rel="stylesheet" type="text/css" href="css/reset.css"/>
        <link rel="stylesheet" href="js/bootstrap/4.1.3/css/bootstrap.min.css"/>
        <link rel="stylesheet" href="js/jquery/themes/default/easyui.css" type="text/css" />
        <script type="text/javascript" src="js/jquery/jquery.min.js"></script>
        <script type="text/javascript" src="js/jquery/jquery.easyui.min.js"></script>
        
        <script src="js/bootstrap/4.1.3/js/bootstrap.min.js"></script>
        <script type="text/javascript">
            
            $(document).ready(function(){
                var bgPicUrl = 'url(./img/loginbg/'+Math.round(Math.random()*25)+".jpg"+')';
                $("#particles-js").css('background-image',bgPicUrl);                
                $('#loginForm').submit(function(){
                    if($('#username').val()===''||$('#password').val()===''){
                         $.messager.alert('提示','用户名或密码不能为空','info');
                         //window.location.reload();
                         return false;
                    }                    
                });                
            });
        </script>
    </head>
    <body>
        <%
            long count = (Long)application.getAttribute("count");
            count++;
            application.setAttribute("count", count);
        %>
        <div id="particles-js">
           
            <nav class="navbar navbar-expand-lg bg-light" style="width:100%">
                <ul class="navbar-nav" style="float:right">                   
                    <li class="nav-item">
                        <a class="nav-link" href="#">问答</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" style="right" href="#">测试</a>
                    </li>                   
                </ul>
                <span style="margin-left:50px;float:right;text-align:right;width:300px;color: darkblue">累计访问次数：</span>
                <span style="float:right;color:darkred">${count}</span>
                
            </nav>
                <!--<a style="float:right" href="https://curl.qcloud.com/ZL2yaHeI" target="_blank">【腾讯云】云产品限时秒杀，爆款2核4G云服务器首年74元</a>-->
            <br>
            <!--<a style="float:right;margin-top: 0px" target="_blank" href="https://curl.qcloud.com/ZL2yaHeI"><image height="200px" width="345" src="./img/ad/txy345x200.jpg"/></a>-->
            <div class="login">
                <ul>
                    <li style="color:red;padding-left: 40px;padding-top:50px">${errmsg}</li>
                </ul>
                <div class="login-top">
                    登录
                </div>
                <form  id ="loginForm" name="loginForm" method="POST" action="servlet/student/LoginStudent">
                <div class="login-center clearfix">
                    <div class="login-center-img"><img src="img/name.png"/></div>
                    <div class="login-center-input">
                        <input type="text" id="username" name="username" value="" placeholder="请输入您的用户名" onfocus="this.placeholder = ''" onblur="this.placeholder = '请输入您的用户名'"/>
                        <div class="login-center-input-text">用户名</div>
                    </div>
                </div>
                <div class="login-center clearfix">
                    <div class="login-center-img"><img src="img/password.png"/></div>
                    <div class="login-center-input">
                        <input type="password" id="password" name="password" value="" placeholder="请输入您的密码" onfocus="this.placeholder = ''" onblur="this.placeholder = '请输入您的密码'"/>
                        <div class="login-center-input-text">密码</div>
                    </div>
                </div>
                </form>
                <div class="login-button">
                    登录
                </div>
            </div>
            <div class="sk-rotating-plane"></div>
        </div>

        <!-- scripts -->
        <script src="js/particles.min.js"></script>
        <script src="js/app.js"></script>
        <script type="text/javascript">
                            function hasClass(elem, cls) {
                                cls = cls || '';
                                if (cls.replace(/\s/g, '').length == 0)
                                    return false; //当cls没有参数时，返回false
                                return new RegExp(' ' + cls + ' ').test(' ' + elem.className + ' ');
                            }

                            function addClass(ele, cls) {
                                if (!hasClass(ele, cls)) {
                                    ele.className = ele.className == '' ? cls : ele.className + ' ' + cls;
                                }
                            }

                            function removeClass(ele, cls) {
                                if (hasClass(ele, cls)) {
                                    var newClass = ' ' + ele.className.replace(/[\t\r\n]/g, '') + ' ';
                                    while (newClass.indexOf(' ' + cls + ' ') >= 0) {
                                        newClass = newClass.replace(' ' + cls + ' ', ' ');
                                    }
                                    ele.className = newClass.replace(/^\s+|\s+$/g, '');
                                }
                            }
                            document.querySelector(".login-button").onclick = function() {
                                /*addClass(document.querySelector(".login"), "active")
                                setTimeout(function() {
                                    addClass(document.querySelector(".sk-rotating-plane"), "active")
                                    document.querySelector(".login").style.display = "none"
                                }, 800)*/
                                /*setTimeout(function() {
                                    removeClass(document.querySelector(".login"), "active")
                                    removeClass(document.querySelector(".sk-rotating-plane"), "active")
                                    document.querySelector(".login").style.display = "block"
                                    
                                    alert("登录成功"+$("input")[0].value+$("input")[1].value);

                                }, 5000)*/
                                
                                $("form[name='loginForm']").submit();
                            }
        </script>
    </body>
</html>
